<template>
    <div>
        组件的生命周期
        <lifeChildVue v-if="flag" @click="flag = !flag"></lifeChildVue>
    </div>
</template>

<script setup>

// 生命周期中没有了 beforeCreated he created 生命周期函数, 在vue2 中还有该生命周期
// setup 一般做初始化使用,执行的时间比 beforeCreate 靠前
// 在vue3中生命周期换名字了 onmonted  等等
// 在vue2中的生命周期 beforeDestroy 和  destroyed 换成了 vue3中的 brforeUnmount 和 unmounted
import lifeChildVue from '../components/lifeChild.vue';
import { ref, onMounted, onUpdated, onBeforeMount, onUnmounted } from 'vue';
const flag = ref(true)
// console.log(onMounted);
onBeforeMount(() => {
    console.log('onBeforeMount');
})

onMounted(() => {
    console.log('onMounted1')

})
onMounted(() => {
    console.log('onMounted2')

})


onUpdated(() => {
    console.log('onUpdated')

})

onUnmounted(() => {
    console.log('onUnmounted');
})




</script>
<style scoped>

</style>